<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript" src="http://validform.rjboy.cn/wp-content/themes/validform/js/jquery-1.6.2.min.js"></script>
	<script type="text/javascript" src="/js/validform/validform.js"></script>
<style type="text/css">
 .box{ width: 800px; height: 35px; margin:0 auto 15px; text-align: center; }
 .box .text{ width: 100px; height:35px; text-align: right; font-size: 14px; float: left; line-height: 35px;}
 .box .input{ width: 700px; height:35px; text-align: left; font-size: 14px; float: left;}
 .box .input input{ width: 378px; height: 33px; border: #999 1px solid; padding-left: 20px; line-height: 35px; }
 .box .input .Validform_right{width: 270px; height: 35px; line-height: 35px; display: block; float: right; padding-left: 20px; background: url(right.png) left center no-repeat; color: #71b83d}
 .box .input .Validform_wrong{width: 270px; height: 35px; line-height: 35px; display: block; float: right; padding-left: 20px; background: url(error.png) left center no-repeat; color: red;}
 </style>
</head>
<body>
<form class="demoform" action="/main/index" method="post">
<div class="box">
 <div class="text">姓名：</div>
 <div class="input">
 <input type="text" value="" name="name" class="inputt" />
 </div>
</div>
<div class="box">
 <button type="submint" style="width: 120px; height: 35px; margin:0 auto;">提交</button>
</div>
</form>
<script type="text/javascript">
$(function(){
    var demo=$(".demoform").Validform({
     tiptype:4,           //这里输入4，表示在右边出现，加上样式后会更漂亮
     showAllError:false, //true：提交表单时所有错误提示信息都会显示；false：一碰到验证不通过的对象就会停止检测后面的元素，只显示该元素的错误信息；
     ajaxPost:true,
     callback:function(o){
     console.log(o);
     if(o.status=="y"){ 
         alert("成功");
         }else{
         alert("失败");
         }
     }
 }); 
 demo.addRule([{        //addRule(rule)可以通过Validform对象的这个方法来给表单元素绑定验证规则，我这里只写了一个，其实可以对很多控件单独验证；
     ele:".inputt:eq(0)",   //这里的inputt是对应的控件里的class="inputt",eq(0)表示第一个元素，这里可简写ele:".inputt" 
     datatype:"m",
     sucmsg:"信息填写正确",
     errormsg:"请输入手机号"
     },
 ]);
});
</script>﻿​
</body>
</html>